<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>type选择器</title>
        <style>
            /* 可编辑:表单元素*/
            input:enabled{
                width: 500px;
            }
            /*不可编辑:表单元素*/
            input:disabled{
                background: red;
            }
            /*选中*/
            input:checked{
                background: red;
            }
            /*相邻兄弟选择器*/
            input:checked+span{
                color:yellow;
            }
            div{
                width: 200px;
                height: 200px;
            }
            /*匹配元素被用户选中，所有元素都可以使用*/
            div::selection{
                background-color:blue;
                color:red;
            }
        </style>
    </head>
    <body>
        <from>
            <input type="text"  disabled style="outline: none"><!--disabled：禁止编写/选择 -->
            <!--outline:获取焦点时候的边框属性-->
            <input type="text">
            <input type="radio" name="sex">
            <span>男</span>
            <input type="radio" name="sex">
            <span>女</span>
        </from>
        <div>6</div>
    </body>
</html>